<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" 
      xmlns:ui="http://java.sun.com/jsf/facelets" 
      xmlns:h="http://java.sun.com/jsf/html" 
      xmlns:t="http://myfaces.apache.org/tomahawk"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:body>
    	<ui:composition template="./templates/framework.xhtml">
			<ui:define name="content">
				<div id="loginContainer" style="display:none">
					<h1 class="login">
						<h:outputText value="#{i18n['login.head']}" />
					</h1>
					<h:form id="loginTopForm">
						<ul>
							<ui:fragment rendered="#{loginBean.passwordLoginEnabled}"><li class="active"><h:commandLink value="#{i18n['generic.email']}" action="login.xhtml" /></li></ui:fragment>
							<ui:fragment rendered="#{loginBean.facebookLoginEnabled}"><li><h:commandLink value="Facebook" action="#{loginBean.loginFacebook}" /></li></ui:fragment>
							<ui:fragment rendered="#{loginBean.googleLoginEnabled}"><li><h:commandLink value="Google" action="#{loginBean.loginGoogle}" /></li></ui:fragment>
							<ui:fragment rendered="#{loginBean.twitterLoginEnabled}"><li><h:commandLink value="Twitter" action="#{loginBean.loginTwitter}" /></li></ui:fragment>
						</ul>
					</h:form>
					<ui:include src="./templates/message.xhtml" />
					<ui:fragment rendered="#{sessionBean.invitationPending}">
						<p>
							<h:outputText value="#{i18n['login.invitationPending']}" />
						</p>
					</ui:fragment>
					<h:form id="loginForm">
						<div>
							<h:outputLabel for="username" value="#{i18n['generic.email']}" />
							<h:inputText id="username" value="#{loginBean.username}" required="true" requiredMessage="#{i18n['login.userMissing']}" autocomplete="off" />
							<span class="error"><h:message for="username" /></span>
						</div>
						<div>
							<h:outputLabel for="password" value="#{i18n['generic.password']}" />
							<h:inputSecret id="password" value="#{loginBean.password}" required="true" requiredMessage="#{i18n['login.passMissing']}" autocomplete="off" validator="#{loginBean.validateUserPass}" />
							<span class="error"><h:message for="password" /></span>
						</div>
						<div>
							<h:selectBooleanCheckbox id="remember" value="#{loginBean.remember}"/>
							<h:outputLabel for="remember" value="#{i18n['login.remember']}" styleClass="checkboxLabel" />
							<span class="error"><h:message for="remember" /></span>
						</div>
						<div class="warn">
							<h:outputText value="#{i18n['login.lostQuestion']}" /><br />
							<a href="resetpassword.xhtml"><h:outputText value="#{i18n['login.getNewPassword']}" /></a>
						</div>
						<div class="buttons">
							<h:commandButton type="submit" value="#{i18n['login.login']}" action="#{loginBean.login}" />
							<ui:fragment rendered="#{loginBean.signupEnabled}">
								<input type="button" value="#{i18n['login.signup']}" class="important" onclick="location.href='signup.xhtml'" />
							</ui:fragment>
						</div>
					</h:form>
				</div>
				<div id="jsNotSupportedError">
					<h1><h:outputText value="#{i18n['login.jsNotSupportedHead']}" /></h1>
					<p>
						<h:outputText value="#{i18n['login.jsNotSupportedText']}" escape="false" />
					</p>
				</div>
				<div id="ssNotSupportedError" style="display:none">
					<h1><h:outputText value="#{i18n['login.html5NotSupportedHead']}" /></h1>
					<p>
						<h:outputText value="#{i18n['login.html5NotSupportedText']}" escape="false" />
					</p>
				</div>
			</ui:define>
		</ui:composition>
    </h:body>
</html>